<script setup lang="ts">
import { ref } from 'vue';
import PPTPreview from './index.vue';

const showPreview = ref(false);
const pptUrl = ref('');

function openPreview() {
  if (!pptUrl.value) {
    ElMessage.warning('请先输入PPT文件URL');
    return;
  }
  showPreview.value = true;
}
</script>

<template>
  <div class="ppt-example">
    <h2>PPT预览组件使用示例</h2>

    <div class="example-controls">
      <el-input
        v-model="pptUrl"
        placeholder="请输入PPT文件URL"
        style="width: 400px; margin-right: 10px;"
      />
      <el-button type="primary" @click="openPreview">
        预览PPT
      </el-button>
    </div>

    <!-- PPT预览组件 -->
    <PPTPreview
      v-model="showPreview"
      :ppt-url="pptUrl"
      :download-url="pptUrl"
    />
  </div>
</template>

<style scoped lang="scss">
.ppt-example {
  padding: 20px;
  .example-controls {
    display: flex;
    align-items: center;
    margin: 20px 0;
  }
}
</style>
